<template>
  <el-dialog
      :before-close="handleClose"
      :title="title"
      :visible.sync="dialogVisible"
      width="30%">
    <el-form ref="ruleForm" :model="ruleForm" :rules="rules" class="demo-ruleForm" label-width="100px">
      <el-form-item label="岗位名称" prop="noteTitle">
        <el-input v-model="ruleForm.postName"></el-input>
      </el-form-item>
      <el-form-item label="岗位限制人数" prop="noteTitle">
        <el-input v-model="ruleForm.limitPersonName"></el-input>
      </el-form-item>
      <el-form-item label="岗位工作内容" prop="noteContect">
        <el-input v-model="ruleForm.postContent" type="textarea"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>
<script>

import {postCreate, postUpdate} from "@/utils/post";

export default {
  data() {
    return {
      dialogVisible: false, record: undefined, title: undefined,
      ruleForm: {
        postName: '',
        limitPersonName: '',
        postContent: '',
      },
      rules: {
        postName: [
          {required: true, message: '请输入名称', trigger: 'blur'},
        ],
        limitPersonName: [{required: true, message: '请输入', trigger: 'blur'},],
        postContent: [{required: true, message: '请输入内容', trigger: 'blur'},],
      }
    };
  },
  methods: {
    submitForm(formName) {
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          if (this.title == '编辑') {
            const res = await postUpdate({...this.record, ...this.ruleForm})
            this.$message.success(res.message)
            this.$emit('callBack')
          } else {
            const res = await postCreate(this.ruleForm)
            this.$message.success(res.message)
            this.$emit('callBack')
          }
          this.dialogVisible = false
        } else {
          return false;
        }
      });
    },
    openByRecord(record) {
      this.title = record.title
      this.dialogVisible = true
      this.record = record
      if (this.title === '编辑') {
        this.ruleForm = record
      }
    },
    handleClose() {
      this.dialogVisible = false
    }
  }
}
</script>